import React from 'react'
import { Provider } from 'mobx-react'
import AppHeader from './views/header/index'

// Router
import Routers from './config/router'
import {
  BrowserRouter as Router,
} from 'react-router-dom'

// Material ui
import getMuiTheme from 'material-ui/styles/getMuiTheme'
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'

// store
import {
  AppStore,
  TopicStore,
} from './store'

const appStore = new AppStore()
const topicStore = new TopicStore()

class App extends React.Component {
  render() {
    return (
      <MuiThemeProvider muiTheme={getMuiTheme()}>
        <Provider appStore={appStore} topicStore={topicStore}>
          <Router>
            <div>
              <AppHeader />
              <Routers />
            </div>
          </Router>
        </Provider>
      </MuiThemeProvider>
    );
  }
}

export default App;
